<template>
	<view class="page">
		<template v-if="isLogin">
			<view class="body"> 

				<view class="lay-btn-wrap"> 
					
					<!-- <view class="lay-btn-item">
						<view class="content">
							<view class="label-name">头像</view>
							<view class="val">
								<view class="con-text split f-grey"></view> 
							</view>  
						</view>
					</view> -->
					<view  class="lay-btn-item">
						<view class="content">
							<view class="label-name">姓 名</view>
							<view class="val"> 
								<view class="con-text split">{{userInfo.username}}</view> 
							</view> 
							<view class="right-icon">
								<view class="iconfont icon-corrow f-s34">&#xe8d4;</view>
							</view>
						</view>
					</view>
					<view class="lay-btn-item">
						<view class="content">
							<view class="label-name">密 码</view>
							<view class="val">
								<view class="con-text split"></view>
								<view class="link-text f-blue" @click="showPopup('show','isRestPassword')">重置密码</view>
							</view>
							<view class="right-icon">
								<view class="iconfont icon-corrow f-s34">&#xe8d4;</view>
							</view>
						</view>
					</view> 			
					
				</view>
				
				<view v-if="false" class="lay-btn-wrap"> 
					<view class="lay-btn-item">
						<view class="content">
							<view class="label-name">开启通知</view> 
							<view class="val"> <!-- 占位 -->	</view> 
							<switch class="switch-btn" color="#ff0000" :checked="permission.notice" style="transform:scale(0.7)" disabled></switch> 
						</view>
					</view> 
				</view>
				
				<!-- <view class="lay-btn-wrap">
					<button v-if="userInfo.openid" class="lay-btn-item" >
						<view class="content">
							<view class="label-name">绑定微信</view>
							<view class="val">
								<view class="wx-icon"><image :src="wx_info.avatarUrl" mode="widthFix"></image></view>
								<view class="link-text f-blue">解除绑定</view>
							</view> 
							<view class="right-icon">
								<view class="iconfont icon-corrow f-s34">&#xe8d4;</view>
							</view>
						</view>
					</button>
					<navigator v-else class="lay-btn-item" @click="bind">
						<view class="content">
							<view class="label-name">绑定微信</view>
							<view class="val">
								<view class="con-text split"></view>
								<view class="link-text f-blue">未绑定</view>
							</view> 
							<view class="right-icon">
								<view class="iconfont icon-corrow f-s34">&#xe8d4;</view>
							</view>
						</view>
					</navigator>
				</view> -->
				
				<!-- <view class="lay-btn-wrap m-b2">
					<view class="lay-btn-item">
						<view class="content">
							<view class="label-name">注销账户</view>
							<view class="val">
								<view class="con-text split"></view> 
								<view class="link-text f-grey">注销后将不能使用相关功能</view>
							</view>
							<view class="right-icon">
								<view class="iconfont icon-corrow f-s34">&#xe8d4;</view>
							</view>
						</view>
					</view>
				</view> -->
				<view class="lay-btn-wrap">
					<view class="lay-btn-item">
						<view class="content">
							<view class="label-name">备案号</view>
							<view class="val">
								<view class="con-text split"></view> 
								<view class="link-text f-grey">粤ICP备17160260号-7A</view>
							</view>
							<view class="right-icon">
								<view class="iconfont icon-corrow f-s34">&#xe8d4;</view>
							</view>
						</view>
					</view>
				</view>
				<view class="lay-btn-wrap">
					<view class="lay-btn-item">
						<navigator url="/pages/authorization/authorization?type=1&url=http://www.isca.cn/privacy/" hover-class="none" class="content">
							<view class="label-name">隐私政策</view>
							<view class="val">
								<view class="con-text split"></view> 
								<view class="link-text f-grey"></view>
							</view>
							<view class="right-icon">
								<view class="iconfont icon-corrow f-s34">&#xe8d4;</view>
							</view>
						</navigator>
					</view>
				</view>
				<view class="lay-btn-wrap">
					<view class="lay-btn-item">
						<navigator url="/pages/feedback/feedback" hover-class="none" class="content">
							<view class="label-name">意见反馈</view>
							<view class="val">
								<view class="con-text split"></view> 
								<view class="link-text f-grey"></view>
							</view>
							<view class="right-icon">
								<view class="iconfont icon-corrow f-s34">&#xe8d4;</view>
							</view>
						</navigator>
					</view>
				</view>
				<view class="lay-btn-wrap">
					<template>
						<view class="lay-btn-item">
							<view class="content">
								<view class="label-name">版本</view>
								<view class="val">
									<view class="con-text split"></view> 
									<view class="link-text version-data">v{{version}}</view>
								</view>
								<view class="right-icon">
									<view class="iconfont icon-corrow f-s34">&#xe8d4;</view>
								</view>
							</view>
						</view>
					</template>
					
				<!-- 	<template v-else>
						<view class="lay-btn-item" >
							<view class="content">
								<view class="label-name">版本</view>
								<view class="val">
									<view class="con-text split"></view> 
									<view class="link-text">v{{version}}</view>
								</view>
								<view class="right-icon">
									<view class="iconfont icon-corrow f-s34">&#xe8d4;</view>
								</view>
							</view>
						</view>
					</template>-->
				</view> 
 

				<view class="btn m-b2" @click="logout">退出登录</view> 

			</view>
		</template>
		
		<c-nav-index :switchTab="6"></c-nav-index>
		
		<view v-if="flag.isFullPage" class="full-fix-page">

			<template>
				<!-- 验证手机 -->
				<view v-if="flag.isCheckPhone" class="popup-wrap a-fadein">
					<view class="popup-type-model ">
						<view class="close-btn iconfont icon-guanbi f-s34" @click="closeSendCode"></view>
						<view class="popup-body">
							<view class="title">验证手机</view>
							<view class="content get-code-popup">
								<view class="phone-text">手机号：{{replace_phone}}</view>
								<view class="code-bar">
									<input type="number" v-model="phone_code" placeholder="输入验证码">
									<view class="get-code-btn" @click="getCode">{{count_time_text}}</view>
								</view>
								<view class="code-comfirm-btn" @click="comfirmCode">确定</view> 
							</view>
						</view>
					</view>
				</view> 
				
				<!-- 修改密码 -->
				<view v-if="flag.isRestPassword" class="popup-wrap a-fadein">
					<view class="popup-type-model ">
						<view class="close-btn iconfont f-s44" @click="showPopup('hide')">&#xeb6a;</view> 
						<view class="popup-body">
							<view class="title">重置密码</view>
							<view class="content get-code-popup">
								<view class="code-bar">
									<input type="password" v-model="old_password" placeholder="输入旧密码">
								</view>  
								<view class="code-bar">
									<input type="password" v-model="new_password" placeholder="输入新密码">
								</view>  
								<view class="code-bar">
									<input type="password" v-model="check_new_password" placeholder="确认新密码">
								</view> 
								<view class="code-comfirm-btn" @click="resetPassword">确定</view>
							</view>
						</view>
					</view>
				</view>
				
				 
			</template>


		</view>
	</view>
</template>

<script>
	import {
		replaceStr,
		checkPhone
	} from '@/common/util.js' 
	import {
		downloadFile,getSystemInfo
	} from '@/common/promise.js'  
	import {
		viewHotFixInit 
	} from '@/common/updateModel.js'
	import WebSocket from '@/common/websocket.js'
	export default {
		name: 'demo',
		data() {
			return {
				isLogin: false, 
				userInfo: uni.getStorageSync('userInfo'),
				version: uni.getStorageSync('now_version'),
				version_update_data:{
					log:'',
					version:'',
					url:''
				},
				isVersionUpdate:false, 
				loginStateUpdate: false, 
				name:'',
				isStop:true,
				flag: { // 弹窗相关
					isFullPage: false, 
					isRestPassword:false 
				},
				old_password:'',
				new_password:'',
				check_new_password:'', 
				permission:{
					notice:false
				}
			}
		},
		async onShow() { 
			console.log(this.userInfo) 
			
			this.isLogin=await this.$loginState('check');
			
			if(this.isLogin){
				this.userInfo=uni.getStorageSync('userInfo');
				 
				// this.replace_phone = replaceStr(this.userInfo.phone, 3, '****');				
				this.checkVersion();
			}		
			
		},
		async onLoad() {
			
				
		},
		methods: {
			bind:function(){
				console.log(123)
				let _this=this;
				uni.login({
				 	provider: 'weixin', 
				    success: function (loginRes) { 
						console.log('loginRes',loginRes)
						uni.getUserInfo({
							provider: 'weixin',
							success:async function (infoRes) {   
								console.log('linfoRes',infoRes)
								infoRes.userInfo.nickName=''; 
								
								let res=await _this.$api.user_api.userwxbd({
									wx_info:JSON.stringify(infoRes.userInfo), 
								})
								console.log(res)
								uni.showLoading({
									mask:true,
									title:'账号绑定中...'
								})
								if(res.data.ret==0){								
									uni.showToast({
										icon:'success',
										title:'账号绑定成功',
										mask:true,
										duration:1000,
										success() {
											setTimeout(()=>{
												uni.hideLoading();
												uni.navigateBack({
													delta:1
												})		
												let userInfo_update=uni.getStorageSync('userInfo');
												userInfo_update.wx_info=JSON.stringify(infoRes.userInfo);
												uni.setStorage({
													key:"userInfo",
													data:userInfo_update
												});
												_this.$store.commit("UPDATE_USERINFO",1);     // 绑定成功 更新上页 userinfo
											},300)
										}
									})
								}else{
									uni.hideLoading(); 
									uni.showToast({
										icon:'error',
										title:res.data.message,
										mask:true,
										duration:1000,
										success() {
											 
										}
									})
								}
							}
						});
				    }
				})
			},
			
			
			// 退出登录 			
			logout:async function(){
				let _this=this;
				uni.showModal({
					content:"确定退出登录吗？",
					async success(res) {
						if(res.confirm){ 
							let logout_res=await _this.$api.user_api.logout(); 
							if(logout_res.data.code==200){
								uni.removeStorageSync('token');
								uni.removeStorageSync('userInfo'); 
								// uni.closeSocket();
								WebSocket.close();
								uni.reLaunch({
									url:'/pages/login/login'
								})
							} 							
						}
					}
				})
				 
			},
			
			// 修改密码
			updatePassword(){
				
			},
			
			// 拨打电话
			tellphone: function() {
				uni.makePhoneCall({
					phoneNumber: this.userInfo.phone
				});
			},

			

			showPopup: function(t, n) {
				if (t == 'show') {
					this.flag.isFullPage = true;
					this.flag[n] = true;
				} else if (t == 'hide') {
					for (let i in this.flag) {
						this.flag[i] = false;
					}
				}
			},
			
			// 更新版本
			updateVersion:async function(){
				let _this=this;
				// 大版本版本更新   弹窗更新提示
				let system = await getSystemInfo(); //  获取系统信息 
				
				if(this.isVersionUpdate){
					viewHotFixInit({
						systemInfo: system,
						log_data: this.version_update_data.remark.split(';'),
						version: this.version_update_data.version,
						versionCode: this.version_update_data.versionCode,
						apk_path: this.version_update_data.file_path
					})
				} 				 
			},
			
			// 监测版本
			checkVersion:async function() { 
				let res = await this.$api.user_api.getVersion();	 
				if(res.data.code==200){
					this.version_update_data=res.data.data;
					let reg2 = /[.]/ig; // 匹配全部 '.' =>''
					let new_version = res.data.data.version.replace(reg2, "");              //  1.0 =>10  版本格式转数字类型
					let old_version = uni.getStorageSync('now_version').replace(reg2, "");     //  1.0 =>10  版本格式转数字类型
					let new_version_arr = res.data.data.version.split('.');                 // 1.0.0 => [1,0,0]  版本转换成数组
					let old_version_arr = uni.getStorageSync('now_version').split('.');           // 1.0.0 => [1,0,0]  版本转换成数组 
					
					if(plus.os.name=="iOS"){
						if(res.data.ios_audit==1 && (Number(new_version)>Number(old_version) || new_version_arr[0] > old_version_arr[0] || new_version_arr[1] >
							old_version_arr[1])){
							this.isVersionUpdate=true;						
						}
					}
					
					if(plus.os.name=="Android"){
						if(Number(new_version)>Number(old_version) || new_version_arr[0] > old_version_arr[0] || new_version_arr[1] >
							old_version_arr[1] ){
							this.isVersionUpdate=true;						
						}
					}
					
				}
				
			},
			
			// 重置密码
			async resetPassword(){
				if(this.old_password==''){
					this.$showToast({
						title:'请输入当前密码',
					})
					return
				}
				if(this.new_password==''){
					this.$showToast({
						title:'请输入新密码',
					})
					return
				}
				if(this.check_new_password==''){
					this.$showToast({
						title:'请再次输入新密码',
					})
					return
				}
				if(this.new_password!=this.check_new_password){
					this.$showToast({
						title:'两次新密码不一致',
					})
					return
				}
				
				if(this.isStop){
					this.isStop=false;
					let res=await this.$api.user_api.changePasswrod({
						old_password:this.old_password,
						new_password:this.new_password,
						check_new_password:this.check_new_password
					})  
					if(res.data.code==200){
						this.$showToast({
							icon:'success',
							title:'密码重置成功'
						}).then(()=>{
							this.showPopup('hide');
							setTimeout(()=>{
								uni.removeStorageSync('token');
								uni.removeStorageSync('userInfo'); 
								uni.reLaunch({
									url:'/pages/login/login'
								})
							},800)							
						})
						this.isStop=true;
					}else{
						this.$showToast({ 
							title:res.data.msg
						})
						this.isStop=true;
					}
				}
				
			},
			
			 
 
			
			// 开启消息通知
			// noticeOpen:function(){ 
			// 	if(plus.os.name=="Android"){
			// 		var main = plus.android.runtimeMainActivity();
			// 		var pkName = main.getPackageName();  	
			// 		var Intent = plus.android.importClass('android.content.Intent');
			// 		var intent = new Intent('android.settings.APP_NOTIFICATION_SETTINGS');//可设置表中所有Action字段  
			// 		intent.putExtra('android.provider.extra.APP_PACKAGE', pkName);  
			// 		main.startActivity(intent);  
			// 	}
				
			// 	if(plus.os.name=="iOS"){
			// 		var UIApplication = plus.ios.import("UIApplication"); 					
			// 		var NSURL2 = plus.ios.import("NSURL");
			// 		var setting2 = NSURL2.URLWithString("app-settings:");  
			// 		var application2 = UIApplication.sharedApplication();  
			// 		application2.openURL(setting2);  
			// 		plus.ios.deleteObject(setting2);  
			// 		plus.ios.deleteObject(NSURL2);  
			// 		plus.ios.deleteObject(application2);  
			// 	}
				
			// },
			
			// 注销账号
			// delectAccount:function(){
			// 	let _this=this;
			// 	uni.showModal({
			// 		content:'注销账号后将不能找回，包括账号关联数据，确定注销账号吗？',
			// 		confirmText:'确定',
			// 		async success(res) {
			// 			if(res.confirm){
			// 				let del_res=await _this.$api.user_api.cancleAccount(); 
			// 				if(del_res.data.ret==0){
			// 					uni.showToast({
			// 						icon:'success',
			// 						title:'账号注销成功',
			// 						mask:true,
			// 						duration:1000,
			// 						success() {
			// 							uni.clearStorage();
			// 							uni.redirectTo({
			// 								url:'/pages/login/login'
			// 							})
			// 						}
			// 					})
			// 				}
			// 			}
			// 		}
			// 	})
			// }
		
		},
		computed: {

		},
		 
		components: {

		},
		onUnload() { 
		},
	}
</script>

<style lang="less" scoped> 

	.lay-btn-wrap {
		margin-top: 20rpx; 
		background: #fff;
		border-bottom: 2rpx solid #eee;
	}

	.lay-btn-item {
		display: flex;
		align-items: center;
		justify-content: space-between; 
		.icon-label {
			display: flex;
			align-items: center;
			width: 60rpx;
			text-align: center;
			color: #09f;

			image {
				width: 38rpx;
			}
		}

		.content {
			flex-shrink: 0;
			display: flex;
			align-items: center;
			flex-grow: 2;
			max-width: 99%;
			padding: 25rpx 0;
			border-bottom: 1rpx solid #eee;

			.label-name {
				width: 200rpx;
				display: flex;
				font-size: 32rpx;
				color: #000;

				image {
					width: 100rpx;
				}
			}

			.val {
				display: flex;
				justify-content: space-between;
				flex-grow: 2;
				width: 90%;
				margin-right: 8rpx;
				font-size: 32rpx;
				color: #666; 
				.con-text {
					flex-grow: 2;
					max-width: 50%;
				}
				.wx-icon{
					width: 50rpx;
					border-radius: 10rpx;
					overflow: hidden;
					image{
						width: 100%;
					}
				}
				.link-text {
					color: #666;
				}
			}

			.right-icon {
				width: 50rpx;
				margin-right: 10rpx;
				.icon-corrow {
					color: #ccc;
				}
			}

			.switch-btn {
				width: 100rpx;
			}
		}

	}

	.lay-btn-item:last-child .content {
		border-bottom: 0 none;

	}

	.btn{
		width: 90%;
		margin: 150rpx auto;
		height: 80rpx;
		line-height: 80rpx;
		text-align: center;
		border-radius: 8rpx;
		background: #09f;
		color:#fff;
		font-size: 32rpx;
	} 

	.code-bar {
		display: flex;
		height: 80rpx;
		border: 1rpx solid #eee;
		border-radius: 15rpx;
		margin-bottom: 20rpx;

		input {
			width: 90%;
			height: 80rpx;
			line-height: 80rpx;
			padding: 0 10rpx;
			font-size: 30rpx;
		}

		.get-code-btn {
			flex-shrink: 0;
			width: 35%;
			line-height: 80rpx;
			text-align: center;
			font-size: 30rpx;
			color: #09f;
		}
	}

	.get-code-popup {
		.phone-text {
			margin-bottom: 30rpx;
			color: #666;
		}

		.code-comfirm-btn {
			height: 70rpx;
			line-height: 70rpx;
			margin: 0 auto;
			background: #09f;
			border-radius: 8rpx;
			color: #fff;
			text-align: center;
			font-size: 30rpx;
		}
	}
	.version-data {
		position: relative;
		font-size: 32rpx;
		color: #333;
		.circle{
			position: absolute;
			right:-20rpx;
			top:0;
			width: 16rpx;
			height: 16rpx;
			background: #f00;
			border-radius: 50%;
		}
	}
</style>
